<template>
  <div class="user-list">
    <el-table :data="users" style="width: 100%">
      <el-table-column prop="username" label="用户名"></el-table-column>
      <el-table-column prop="name" label="姓名"></el-table-column>
      <el-table-column prop="gender" label="性别"></el-table-column>
      <el-table-column prop="phone" label="手机号"></el-table-column>
    </el-table>
  </div>
</template>

<script>
export default {
  name: "UserList",
  data() {
    return {
      users: [
        {
          username: "user1",
          name: "张三",
          gender: "男",
          phone: "13812345678",
        },
        {
          username: "user2",
          name: "李四",
          gender: "女",
          phone: "13987654321",
        },
        // more users...
      ],
    };
  },
};
</script>

<style>
.user-list {
  padding: 20px;
}
</style>
